<template>
  <div class="GHighriskBehaviorDetail" :loading="loading">
    <zyInfoPanel :title="title" :showUnfoldButton="false" class="baseInfo">
      <div class="baseContainer">
        <zy-modal-info :model-info="baseInfo" cell-num="2"></zy-modal-info>
      </div>
    </zyInfoPanel>
    <zyInfoPanel :headType="type=='detail'?'title':'checkbox'" title="人员关联" v-model="is_judge_person"
                 :showUnfoldButton="false" class="baseInfo">
      <div class="baseContainer">
        <div class="baseBox">
          <div class="baseBoxTitle" :class="type=='detail'?'':'required'">匹配要素</div>
          <div class="radioCheckBox">
            <div class="radioBox" @click="type=='detail'?'':clickModel('1')">
              <el-radio v-model="radio" label="1" :disabled="type=='detail'">高危人员选择</el-radio>
            </div>
            <div class="radioBox" @click="type=='detail'?'':clickModel('2')">
              <el-radio v-model="radio" label="2" :disabled="type=='detail'">手工输入人员信息</el-radio>
            </div>
          </div>
          <div class="radioCheckBox">
            <el-checkbox-group v-model="judge_type" :disabled="type=='detail'">
              <el-checkbox label="1">姓名：{{judge_person_name}}</el-checkbox>
              <el-checkbox label="2">联系电话：{{judge_person_phone}}</el-checkbox>
              <el-checkbox label="3">身份证号：{{judge_person_card_no}}</el-checkbox>
            </el-checkbox-group>
          </div>
        </div>
        <div class="baseBox">
          <div class="baseBoxTitle" :class="type=='detail'?'':'required'">匹配方式</div>
          <div class="radioCheckBox">
            <el-radio-group v-model="person_is_match" :disabled="type=='detail'">
              <el-radio v-for="radio in matchList" :key="radio.value" :label="radio.value">{{radio.label}}</el-radio>
            </el-radio-group>
          </div>
        </div>
        <div class="baseBox">
          <div class="baseBoxTitle" :class="type=='detail'?'':'required'">匹配对象</div>
          <div class="radioCheckBox">
            <el-checkbox-group v-model="match_object" :disabled="type=='detail'">
              <el-checkbox v-for="checkbox in matchObjectList" :label="checkbox.value" :key="checkbox.value">
                {{checkbox.label}}
              </el-checkbox>
            </el-checkbox-group>
          </div>
        </div>
      </div>
    </zyInfoPanel>
    <zyInfoPanel :headType="type=='detail'?'title':'checkbox'" title="物品关联" v-model="is_judge_good"
                 :showUnfoldButton="false" class="baseInfo">
      <div class="baseContainer">
        <div class="baseBox">
          <div class="baseBoxTitle" :class="type=='detail'?'':'required'">匹配要素</div>
          <div class="baseBoxItem">
            <div class="boxItemCont">
              <el-radio v-model="is_good_type" label="1" :disabled="type=='detail'">物品类型：</el-radio>
              <el-select v-model="good_type_id" :disabled="type=='detail'">
                <el-option v-for="option in goods_type_list" :key="option.value" :label="option.label"
                           :value="option.value"></el-option>
              </el-select>
            </div>
            <div class="boxItemCont">
              <el-radio v-model="is_good_type" label="2" :disabled="type=='detail'">物品名称：</el-radio>
              <el-select v-model="good_name_id" :disabled="type=='detail'">
                <el-option v-for="option in goods_list" :key="option.value" :label="option.label"
                           :value="option.value"></el-option>
              </el-select>
            </div>
          </div>
        </div>
        <div class="baseBox">
          <div class="baseBoxTitle" :class="type=='detail'?'':'required'">匹配方式</div>
          <div class="radioCheckBox">
            <el-radio-group v-model="good_is_match" :disabled="type=='detail'">
              <el-radio v-for="radio in goodMatchList" :key="radio.value" :label="radio.value"
                        :disabled="type=='detail'">{{radio.label}}
              </el-radio>
            </el-radio-group>
          </div>
        </div>
      </div>
    </zyInfoPanel>
    <zyInfoPanel :headType="type=='detail'?'title':'checkbox'" title="线路关联" v-model="is_judge_region"
                 :showUnfoldButton="false" class="baseInfo">
      <div class="baseContainer">
        <div class="baseBox">
          <div class="baseBoxTitle" :class="type=='detail'?'':'required'">匹配要素</div>
          <div class="baseBoxItem">
            <div class="boxItemName">地点名称：</div>
            <el-cascader v-model="region" :options="arrive_region" filterable :disabled="type=='detail'"
                         :props="{ checkStrictly: true,value:'value',label:'label',children:'children' }"
                         clearable>
            </el-cascader>
            <div class="tips">（注：可单独选择省、市）</div>
          </div>
        </div>
      </div>
    </zyInfoPanel>
    <zyInfoPanel :headType="type=='detail'?'title':'checkbox'" title="电话关联" v-model="is_judge_phone"
                 :showUnfoldButton="false" class="baseInfo">
      <div class="baseContainer">
        <div class="baseBox">
          <div class="baseBoxTitle" :class="type=='detail'?'':'required'">匹配要素</div>
          <div class="baseBoxItem">
            <div class="boxItemCont">
              <el-radio v-model="is_phone_open" label="1" :disabled="type=='detail'">电话号码：</el-radio>
              <zy-input v-model="judge_phone" placeholder="请输入电话号码" :disabled="type=='detail'"></zy-input>
            </div>
            <div class="boxItemCont">
              <el-radio v-model="is_phone_open" label="2" :disabled="type=='detail'">号码归属地：</el-radio>
              <el-cascader v-model="mobileRegion" :options="arrive_region" filterable :disabled="type=='detail'"
                           :props="{ checkStrictly: true,value:'value',label:'label',children:'children' }"
                           clearable>
              </el-cascader>
              <div class="tips">（注：可单独选择省、市）</div>
            </div>
          </div>
        </div>
      </div>
    </zyInfoPanel>
    <zyInfoPanel title="预警设置" :showUnfoldButton="false" class="baseInfo">
      <div class="baseContainer">
        <zy-modal-info :model-info="setInfo" cell-num="2"></zy-modal-info>
      </div>
    </zyInfoPanel>
    <zyInfoPanel title="备注" :showUnfoldButton="false" class="baseInfo">
      <div class="baseContainer">
        <zy-modal-info :model-info="remarkInfo"></zy-modal-info>
        <div class="btnArea">
          <zy-button @click="back">{{type=='detail'?'返回':'取消'}}</zy-button>
          <zy-button type="primary" :loading="submitLoading" v-if="type=='add'||type=='edit'" @click="submit">提交
          </zy-button>
        </div>
      </div>
    </zyInfoPanel>
    <personnelModel :show="show" @close="close"></personnelModel>
    <zyModel title="人员信息" :show="editShow" @close="closeEdit" @submit="submitEdit">
      <div class="personalChange">
        <zy-modal-info :model-info="modelInfo"></zy-modal-info>
      </div>
    </zyModel>
  </div>
</template>

<script>

	import personnelModel from "./personnelModel";
	import {mapGetters} from "vuex";

	export default {
		name: "GHighriskBehaviorDetail",
		props: {},
		data() {
			return {
				editShow: false,
				modelInfo: [
					{
						title: '姓名',
						name: 'judge_person_name',
						type: 'input',
						value: '',
						titleClass: 'required'
					},
					{
						title: '联系电话',
						name: 'judge_person_phone',
						type: 'input',
						value: '',
						titleClass: 'required'
					},
					{
						title: '身份证号',
						name: 'judge_person_card_no',
						type: 'input',
						value: '',
						titleClass: 'required'
					}
				],
				show: false,
				submitLoading: false,
				loading: false,
				title: '',
				judge_action_id: '',
				type: '',
				baseInfo: [
					{
						title: '高危行为名称',
						name: 'judge_action_name',
						type: 'input',
						value: '',
						titleClass: 'required'
					}
				],
				/*人员关联*/
				is_judge_person: false,
				radio: '',
				radioList: [
					{
						label: '高危人员选择',
						value: '0'
					},
					{
						label: '手工输入人员信息',
						value: '1'
					}
				],
				judge_type: ['1'],
				judge_person_name: '',
				judge_person_phone: '',
				judge_person_card_no: '',
				person_is_match: '1',
				matchList: [
					{
						label: '全部要素匹配',
						value: '1'
					},
					{
						label: '任意一个要素匹配',
						value: '2'
					}
				],
				match_object: ['1'],
				matchObjectList: [
					{
						label: '寄件人',
						value: '1'
					},
					{
						label: '收件人',
						value: '2'
					}, {
						label: '从业人员',
						value: '3'
					}
				],
				/*物品关联*/
				is_judge_good: false,
				is_good_type: '1',
				goods_type_list: [],
				good_type: '',
				good_type_id: '',
				goods_list: [],
				good_name: '',
				good_name_id: '',
				good_is_match: '1',
				goodMatchList: [
					{
						label: '精确匹配',
						value: '1'
					},
					{
						label: '模糊匹配',
						value: '2'
					}
				],
				/*线路关联*/
				is_judge_region: false,
				region: [],
				arrive_region: [],
				/*电话关联*/
				is_judge_phone: false,
				is_phone_open: '1',
				judge_phone: '',
				mobileRegion: [],
				/*预警设置*/
				setInfo: [
					{
						title: '关注等级',
						name: 'judge_level',
						type: 'select',
						optionList: [
							{label: '1', value: '1'},
							{label: '2', value: '2'},
							{label: '3', value: '3'},
							{label: '4', value: '4'},
							{label: '5', value: '5'},
						],
						value: '',
						titleClass: 'required'
					},
					{
						title: '是否标记可疑件',
						name: 'is_dubious',
						type: 'radio',
						value: '',
						optionList: [
							{label: '否', value: '0'},
							{label: '是', value: '1'},
						],
						readonly: false,
						titleClass: 'required'
					},
					{
						title: '预警方式',
						name: 'early_type',
						type: 'checkbox',
						value: [],
						optionList: [
							{label: '短信', value: '1'},
							{label: '站内信', value: '2'},
						],
						readonly: false,
						titleClass: ''
					},
					{
						title: '预警人员',
						name: 'police_ids',
						type: 'selectMultiple',
						value: '',
						showWord: true,
						optionList: [],
						readonly: false,
						titleClass: '',
					},
				],
				/*备注*/
				remarkInfo: [
					{
						title: '备注',
						name: 'remark',
						type: 'input',
						value: '',
						readonly: false,
						titleClass: ''
					}
				]
			};
		},
		computed: {
			...mapGetters(['getAreaList']),
		},
		watch: {},
		components: {personnelModel},
		methods: {
			clickModel(radio) {
				switch (radio) {
					case '1':
						this.show = true;
						break;
					case '2':
						this.editShow = true;
						break;
				}
			},
			getRegionList() {
				//获取省、市、区县 地区列表数据
				if (this.getAreaList.length) {
					this.arrive_region = this.getAreaList
				} else {
					this.$axios.post(this.$api.arriveRegionList, {}).then(res => {
						let {code, msg, data} = res;
						if (code == 200) {
							this.changeState({areaList: data})
							this.arrive_region = data
						} else {
							this.$message.error(msg);
						}
					}).catch(ret => {
						this.$message.error(ret.msg || '服务繁忙，请稍后再试');
					});
				}
			},
			getPoliceData() {
				this.$axios.post(this.$api.g_listContactPolice, {
					pagination: {
						page_start: 1,
						page_size: 9999
					}
				}).then(res => {
					let {code, msg, data} = res;
					if (code == 200) {
						let list = JSON.parse(JSON.stringify(data.list));
						this.setOptionList({
							police_ids: list.filter(item => {
								item.value = String(item.id)
								item.label = item.name
								return item;
							}),
						}, ['police_ids']);
					} else {
						this.$message.error(msg);
					}
				}).catch(ret => {
					this.$message.error(ret.msg || '服务繁忙，请稍后再试');
				});
			},
			getGoodTypeData() {
				this.$axios.post(this.$api.admin_allGoodsType, {}).then(res => {
					let {code, data, msg} = res;
					if (code === 200) {
						let arr = [];
						for (let key in data) {
							let obj = {};
							obj.label = data[key];
							obj.value = key;
							arr.push(obj)
						}
						this.goods_type_list = arr;
					} else {
						this.$message.error(msg);
					}
				})
			},
			getTypeGoods() {
				this.$axios.post(this.$api.g_getTypeGoods, {}).then(res => {
					let {code, data, msg} = res;
					if (code === 200) {
						let arr = [];
						data.forEach(item => {
							item.label = item.delivery_category_name;
							item.value = item.delivery_category_id;
							arr.push(item)
						})
						this.goods_list = arr;
					} else {
						this.$message.error(msg);
					}
				})
			},
			setOptionList(val, nameList) {
				for (let item of this.setInfo) {
					if (nameList.indexOf(item.name) !== -1) {
						item.optionList = val[item.name]
					}
				}
			},
			back(isRefresh) {
				this.$blackRoute({path: '/judge_action_list', that: this, name: 'GHighriskBehaviorList', params: {isRefresh}})
			},
			submit() {
				if (!this.baseInfo[0].value) return this.$message.error('请输入高危行为名称')
				let isChecked = 0;
				if (this.is_judge_person) {
					isChecked = 1;
					if (!this.judge_person_name || !this.judge_person_phone || !this.judge_person_card_no) {
						return this.$message.error('请在【人员关联】项中【匹配要素】选择或输入人员信息')
					}
					if (this.judge_type && !this.judge_type.length) {
						return this.$message.error('【人员关联】项中【匹配要素】的姓名、联系电话、身份证号至少需勾选一个')
					}
					if (this.match_object && !this.match_object.length) {
						return this.$message.error('【人员关联】项中【匹配对象】的寄件人、收件人、从业人员至少需勾选一个')
					}
				}
				if (this.is_judge_good) {
					isChecked = 1;
					if (this.is_good_type == '1' && !this.good_type_id)
						return this.$message.error('请选择【物品关联】项中【匹配要素】的物品类型')
					if (this.is_good_type == '2' && !this.good_name_id)
						return this.$message.error('请选择【物品关联】项中【匹配要素】的物品名称')
				}
				if (this.is_judge_region) {
					isChecked = 1;
					if (!this.region.length)
						return this.$message.error('请选择【线路关联】项中【匹配要素】的地点名称')
				}
				if (this.is_judge_phone) {
					isChecked = 1;
					if (this.is_phone_open == '1' && !this.judge_phone)
						return this.$message.error('请输入【电话关联】项中【匹配要素】的电话号码')
					if (this.is_phone_open == '2' && !this.mobileRegion.length)
						return this.$message.error('请选择【电话关联】项中【匹配要素】的号码归属地')
				}
				if (isChecked == '0')
					return this.$message.error('【人员关联】【物品关联】【线路关联】【电话关联】至少需勾选一个')
				this.submitLoading = true;
				let postData = {
					judge_action_id: this.judge_action_id,
					judge_action_name: this.baseInfo[0].value,
					is_judge_person: this.is_judge_person,
					judge_type: this.judge_type.join() || '',
					judge_person_name: this.judge_person_name || '',
					judge_person_phone: this.judge_person_phone || '',
					judge_person_card_no: this.judge_person_card_no || '',
					person_is_match: this.person_is_match,
					match_object: this.match_object.join() || '',
					is_judge_good: this.is_judge_good,
					is_good_type: this.is_good_type,
					good_type_id: this.good_type_id,
					good_name_id: this.good_name_id,
					good_is_match: this.good_is_match,
					is_judge_region: this.is_judge_region,
					province: this.region[0],
					city: this.region[1],
					district: this.region[2],
					is_judge_phone: this.is_judge_phone,
					is_phone_open: this.is_phone_open,
					judge_phone: this.judge_phone,
					phone_province: this.mobileRegion[0],
					phone_city: this.mobileRegion[1],
					phone_district: this.mobileRegion[2],
					remark: this.remark
				}

				this.setInfo.forEach(item => {
					if (!item.readonly) {
						if (item.name == 'early_type' || item.name == 'police_ids') {
							postData[item.name] = item.value.join();
						} else {
							postData[item.name] = item.value;
						}
					}
				})
				this.goods_type_list.forEach(item => {
					if (item.value == this.good_type_id) {
						postData['good_type'] = item.label
					}
				})
				this.goods_list.forEach(item => {
					if (item.value == this.good_name_id) {
						postData['good_name'] = item.label
					}
				})
				this.remarkInfo.forEach(item => {
					if (item.name == 'remark') {
						postData['remark'] = item.value
					}
				})
				this.$axios.post(this.$api.g_entryJudgeAction, {
					...postData
				}).then(res => {
					this.submitLoading = false
					let {code, msg, data} = res;
					this.loading = false;
					if (code == 200) {
						this.back(true)
					} else {
						this.$message.error(msg);
					}
				}).catch(ret => {
					this.submitLoading = false
					this.$message.error(ret.msg || '服务繁忙，请稍后再试');
				});
			},
			getData() {
				this.loading = true;
				this.$axios.post(this.$api.g_judgeActionDetail, {judge_action_id: this.judge_action_id}).then(res => {
					let {code, msg, data} = res;
					this.loading = false;
					if (code == 200) {
						this.baseInfo.forEach(item => {
							if (item.name == 'judge_action_name') {
								item.value = data['judge_action_name']
							}
							item.readonly = this.type == 'detail';
							item.titleClass = this.type == 'detail' ? '' : 'required';
						})
						this.remarkInfo.forEach(item => {
							if (item.name == 'remark') {
								item.value = data['remark'] || '无'
							}
							item.readonly = this.type == 'detail';
							item.titleClass = this.type == 'detail' ? '' : 'required';
						})
						this.setInfo = this.setInfo.filter(item => {
							item.disabled = this.type == 'detail';
							for (var key in data) {
								if (item.name == 'is_dubious') {
									item.value = String(data[item.name]) || '';
									item.titleClass = this.type == 'detail' ? '' : 'required';
								} else if (item.name == 'judge_level') {
									item.value = String(data[item.name]) || '';
									item.type = this.type == 'detail' ? 'rate' : 'select'
									item.titleClass = this.type == 'detail' ? '' : 'required';
								} else if (item.name == 'early_type') {
									item.value = data[item.name] ? [...data[item.name]] : []
								} else if (item.name == 'police_ids') {
									item.value = data[item.name] && data[item.name].length ? data[item.name].split(',') : []
								} else {
									item.value = data[item.name];
								}
							}
							return item
						});
						this.is_judge_person = data.is_judge_person == 1;
						this.judge_type = data.judge_person_type.length ? data.judge_person_type.split(',') : '';
						this.judge_person_name = data.judge_person_name || '';
						this.judge_person_phone = data.judge_person_phone || '';
						this.judge_person_card_no = data.judge_person_card_no || '';
						this.person_is_match = String(data.person_is_match) || '';
						this.match_object = data.match_object.length ? data.match_object.split(',') : '';
						this.is_judge_good = data.is_judge_good == 1;
						this.is_good_type = String(data.is_good_type) || '';
						this.good_type_id = data.good_type_id != 0 ? String(data.good_type_id) : '';
						this.good_name_id = data.good_name_id != 0 ? String(data.good_name_id) : '';
						this.good_is_match = String(data.good_is_match) || '';
						this.is_judge_region = data.is_judge_region == 1;
						this.region = [data.province || '', data.city || '', data.district || '']
						this.is_judge_phone = data.is_judge_phone == 1;
						this.is_phone_open = String(data.is_phone_open) || '';
						this.judge_phone = data.judge_phone || '';
						this.mobileRegion = [data.phone_province || '', data.phone_city || '', data.phone_district || '']
					} else {
						this.$message.error(msg);
					}
				}).catch(ret => {
					this.loading = false;
					this.$message.error(ret.msg || '服务繁忙，请稍后再试');
				});
			},
			close(data) {
				this.show = false;
				if (data) {
					this.judge_person_name = data.judge_person_name
					this.judge_person_phone = data.judge_person_phone
					this.judge_person_card_no = data.judge_person_card_no
				}
			},
			closeEdit() {
				this.editShow = false;
			},
			submitEdit() {
				this.modelInfo.forEach(item => {
					if (!item.readonly) {
						this[item.name] = item.value;
					}
				});
				this.closeEdit()
			}
		},
		mounted() {
			let {type, judge_action_id} = this.$route.query
			this.type = type || '';
			this.judge_action_id = judge_action_id || '';
			if (this.type === 'deital') {
				this.title = '高危行为详情'
			} else if (this.type === 'add') {
				this.title = '新增高危行为'
			} else {
				this.title = '编辑高危行为'
			}
			this.getRegionList();
			this.getPoliceData()
			this.getGoodTypeData()
			this.getTypeGoods()
			if (type != 'add') {
				this.getData();
			}
		},
		created() {
		}
	}
</script>

<style scoped lang="less" src="@/style/government/judgeManage/highriskBehaviorDetail/index.less">

</style>
